﻿@using WebApp.Models
@model IEnumerable<DataTableImportMapping>
    @{
        ViewBag.Title = "Excel导入配置";
    }
    <!-- MAIN CONTENT -->
    <div id="content">
        <!-- quick navigation bar -->
        <div class="row">
            <div class="col-xs-12 col-sm-7 col-md-7 col-lg-4">
                <h1 class="page-title txt-color-blueDark">
                    <i class="fa fa-table fa-fw "></i>

                    系统管理
                    <span>
                        >
                        Excel导入配置
                    </span>
                </h1>
            </div>
            <div class="col-xs-12 col-sm-5 col-md-5 col-lg-8">

            </div>
        </div>
        <!-- end quick navigation bar -->
        <!-- widget grid -->
        <section id="widget-grid" class="">
            <!-- row -->
            <div class="row">
                <!-- NEW WIDGET START -->
                <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <!-- Widget ID (each widget will need unique ID)-->
                    <div class="jarviswidget" id="wid-id-4" data-widget-editbutton="false">
                        <!-- widget options:
                        usage: <div class="jarviswidget" id="wid-id-0" data-widget-editbutton="false">
                        data-widget-colorbutton="false"
                        data-widget-editbutton="false"
                        data-widget-togglebutton="false"
                        data-widget-deletebutton="false"
                        data-widget-fullscreenbutton="false"
                        data-widget-custombutton="false"
                        data-widget-collapsed="true"
                        data-widget-sortable="false"
                        -->
                        <header>
                            <span class="widget-icon"> <i class="fa fa-table"></i> </span>
                            <h2>Excel导入配置</h2>
                        </header>

                        <!-- widget div-->
                        <div>
                            <!-- widget edit box -->
                            <div class="jarviswidget-editbox">
                                <!-- This area used as dropdown edit box -->
                            </div>
                            <!-- end widget edit box -->
                            <!-- widget content -->
                            <div class="widget-body no-padding">
                                <div class="widget-body-toolbar">
                                    <div class="row">
                                        <div class="col-sm-8  ">
                                            <input class="easyui-combobox"
                                                   name="entities"
                                                   id="entities"
                                                   data-options="
                                               url:'/DataTableImportMappings/GetAllEntites',
                                        method:'get',
                                        valueField:'Name',
                                        textField:'Value',
                                        panelHeight:'auto'
                                        ">
                                            <div class="btn-group">
                                                <a href="javascript:generate()" class="btn btn-sm btn-primary"> <i class="fa fa-plus"></i> 生成配置 </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:createexceltemplate()" class="btn btn-sm btn-primary"> <i class="fa fa-file-excel-o"></i> 生成导入/导出模板 </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:removeit()" class="btn btn-sm btn-default"> <i class="fa fa-trash-o"></i> 删除 </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:accept()" class="btn btn-sm btn-default"> <i class="fa fa-floppy-o"></i> 保存 </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:reload()" class="btn btn-sm btn-default"> <i class="fa fa-refresh"></i> 刷新 </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:reject()" class="btn btn-sm btn-default"> <i class="fa fa-window-close-o"></i> 取消 </a>
                                            </div>

                                            <div class="btn-group">
                                                <a href="javascript:exportexcel()" class="btn btn-sm btn-default"> <i class="fa fa-file-excel-o"></i> 导出Excel </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:print()" class="btn btn-sm btn-default"> <i class="fa fa-print"></i> 打印 </a>
                                            </div>
                                            <div class="btn-group">
                                                <a href="javascript:dohelp()" class="btn btn-sm btn-default"> <i class="fa fa-question-circle-o"></i> 帮助 </a>
                                            </div>
                                        </div>
                                        <div class="col-sm-4 text-align-right">
                                            <div class="btn-group">
                                                <a href="javascript:window.history.back()" class="btn btn-sm btn-success"> <i class="fa fa-chevron-left"></i> 返回 </a>
                                            </div>
                                        </div>
                                    </div>

                                </div>
                                <div class="alert alert-warning no-margin fade in">
                                    <button class="close" data-dismiss="alert">
                                        ×
                                    </button>
                                    <i class="fa-fw fa fa-info"></i>
                                    执行【生成】配置信息时会先删除已经存在的mapping关系，同时请更新导入模板！
                                </div>
                                <!--begin datagrid-content -->
                                <div class="table-responsive">
                                    <table id="datatableimportmappings_datagrid"></table>

                                </div>
                                <!--end datagrid-content -->

                            </div>
                            <!-- end widget content -->
                        </div>
                        <!-- end widget div -->

                    </div>
                    <!-- end widget -->

                </article>
                <!-- WIDGET END -->

            </div>

            <!-- end row -->
        </section>
        <!-- end widget grid -->


    </div>
    <!-- END MAIN CONTENT -->



    @section Scripts {
        <script type="text/javascript">
            //上传导入参数设定
            const entityname = "DataTableImportMapping";
            function print() {
                $dg.datagrid('print', 'DataGrid');
            }
            function dohelp() {

            }
            function generate() {
                var entityname = $('#entities').combobox('getValue');
                if (entityname.length > 0) {
                    $.messager.progress({ title: '正在处理请耐心等待！' });
                    $.post('/DataTableImportMappings/Generate', { entityname: entityname }, function (data, textStatus, jqXHR) {
                        //console.log(data);
                        $.messager.progress('close');
                        $.messager.alert("提示", "生成完成！", 'info', function () {
                            $dg.datagrid('reload');
                        });

                    });
                } else {
                    $.messager.alert("提示", "请选中需要生成Mapping关系的实体类！");
                    $('#entities').focus();
                }

            }
            function createexceltemplate() {
                var entityname = $('#entities').combobox('getValue');
                if (entityname.length > 0) {
                    $.messager.progress({ title: '正在处理请耐心等待！' });
                    $.post('/DataTableImportMappings/CreateExcelTemplate', { entityname: entityname }, function (data, textStatus, jqXHR) {
                        //console.log(data);
                        $.messager.progress('close');
                        if (data.success) {
                            $.messager.alert("提示", "创建完成！", 'info', function () {
                                $dg.datagrid('reload');
                            });
                        } else {
                            $.messager.alert("错误", data.message, 'error')
                        }
                    });
                } else {
                    $.messager.alert("提示", "请选中需要生成模板的实体类！");
                    $('#entities').focus();
                }
            }




            function importexcel() {
                $('#importwindow').window('open');
            }

            var $dg = $('#datatableimportmappings_datagrid');
            var editIndex = undefined;
            function endEditing() {
                if (editIndex == undefined) { return true }
                if ($dg.datagrid('validateRow', editIndex)) {

                    $dg.datagrid('endEdit', editIndex);
                    editIndex = undefined;


                    return true;
                } else {
                    return false;
                }
            }
            function onClickCell(index, field) {
                if (editIndex != index) {
                    if (endEditing()) {
                        $dg.datagrid('selectRow', index)
                            .datagrid('beginEdit', index);
                        var ed = $dg.datagrid('getEditor', { index: index, field: field });
                        if (ed) {
                            ($(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target)).focus();
                        }
                        editIndex = index;
                    } else {
                        $dg.datagrid('selectRow', editIndex);
                    }
                }
            }
            function append() {
                if (endEditing()) {
                    $dg.datagrid('appendRow', { status: 'P' });
                    editIndex = $dg.datagrid('getRows').length - 1;
                    $dg.datagrid('selectRow', editIndex)
                        .datagrid('beginEdit', editIndex);
                }
            }
            function removeit() {
                if (editIndex == undefined) { return }
                $dg.datagrid('cancelEdit', editIndex)
                    .datagrid('deleteRow', editIndex);
                editIndex = undefined;
            }
            function accept() {
                if (endEditing()) {
                    if ($dg.datagrid('getChanges').length) {
                        var inserted = $dg.datagrid('getChanges', "inserted");
                        var deleted = $dg.datagrid('getChanges', "deleted");
                        var updated = $dg.datagrid('getChanges', "updated");
                        var effectRow = new Object();
                        if (inserted.length) {
                            effectRow.inserted = inserted;
                        }
                        if (deleted.length) {
                            effectRow.deleted = deleted;
                        }
                        if (updated.length) {
                            effectRow.updated = updated;
                        }
                        console.log(JSON.stringify(effectRow));
                        $.post("/DataTableImportMappings/SaveData", effectRow, function (res) {
                            //console.log(res);
                            if (res.success) {
                                $.messager.alert("提示", "提交成功！");
                                $dg.datagrid('acceptChanges');
                                $dg.datagrid('reload');
                            }
                        }, "json").fail(function () {
                            $.messager.alert("错误", "提交错误了！", 'error');

                        });

                    }

                    $dg.datagrid('acceptChanges');
                }
            }
            function reject() {
                $dg.datagrid('rejectChanges');
                editIndex = undefined;
            }
            function getChanges() {
                var rows = $dg.datagrid('getChanges');
                alert(rows.length + ' rows are changed!');
            }


    $(function () {

        $dg.datagrid({
            idField: 'Id',
            sortName: 'Id',
            sortorder: 'asc',
            rownumbers: true,
            remoteFilter: true,
            singleSelect: true,
            toolbar: '#datatableimportmappings_toolbar',
            url: '/DataTableImportMappings/GetData',
            method: 'get',
            onClickCell: onClickCell,
            pagination: 'true',
            columns: [[
                { field: 'Id', width: 80, resizable: true, title: '@Html.DisplayNameFor(model => model.Id)' },
                { field: 'EntitySetName', width: 140, resizable: true, title: '@Html.DisplayNameFor(model => model.EntitySetName)' },
                { field: 'FieldName', width: 140, title: '@Html.DisplayNameFor(model => model.FieldName)' },
                { field: 'TypeName', width: 140, title: '@Html.DisplayNameFor(model => model.TypeName)' },
                { field: 'IsRequired', width: 140, title: '@Html.DisplayNameFor(model => model.IsRequired)' },
                { field: 'DefaultValue', width: 140, editor: { type: 'textbox', options: { required: false } }, title: '@Html.DisplayNameFor(model => model.DefaultValue)' },
                { field: 'SourceFieldName', width: 140, editor: { type: 'textbox', options: { required: false } }, title: '@Html.DisplayNameFor(model => model.SourceFieldName)' },
                {
                    field: 'IsEnabled', width: 120, editor: {
                        type: 'combobox'
                        , options: {
                            panelHeight: 'auto',
                            data: [{ value: 'true', text: 'true' }, { value: 'false', text: 'false' }],
                            required: true
                        }
                    }, title: '@Html.DisplayNameFor(model => model.IsEnabled)'
                },
                { field: 'RegularExpression', width: 140, editor: { type: 'textbox', options: { required: false } }, title: '@Html.DisplayNameFor(model => model.RegularExpression)' }
            ]]

        });
        $dg.datagrid('enableFilter', [
            {
                field: 'EntitySetName',
                type: 'combobox',
                options: {
                    panelHeight: 'auto',
                    url: '/DataTableImportMappings/GetAllEntites',
                    method: 'get',
                    valueField: 'Name',
                    textField: 'Value',
                    onChange: function (value) {
                        if (value == '') {
                            $dg.datagrid('removeFilterRule', 'EntitySetName');
                        } else {
                            $dg.datagrid('addFilterRule', {
                                field: 'EntitySetName',
                                op: 'equal',
                                value: value
                            });
                        }
                        $dg.datagrid('doFilter');
                    }
                }
            },

            {
                field: 'IsEnabled',
                type: 'combobox',
                options: {
                    panelHeight: 'auto',
                    data: [{ value: '', text: 'All' }, { value: 'true', text: 'true' }, { value: 'false', text: 'false' }],
                    onChange: function (value) {
                        if (value == '') {
                            $dg.datagrid('removeFilterRule', 'IsEnabled');
                        } else {
                            $dg.datagrid('addFilterRule', {
                                field: 'IsEnabled',
                                op: 'equal',
                                value: value
                            });
                        }
                        $dg.datagrid('doFilter');
                    }
                }
            }

        ]);
    });
        </script>
        <script src="~/Scripts/jquery.filerupload.min.js"></script>
    }

